var Vehicle = Class.create();

Vehicle.prototype = {
	initialize : function(options) {
		VEHICLE = this;
		this.speed = 30 / 3.6 * 2 / 30 + 0.1;
		this.styles = new Array();
		this.nextX = new Array();
		this.nextY = new Array();
		this.curX = new Array();
		this.curY = new Array();
	},
	finishApart: function(cid,cx,cy,nx,ny){
		if((VEHICLE.nextX[cid] != nx|| VEHICLE.nextY[cid] != ny )
		  &&(VEHICLE.curX[cid] != cx|| VEHICLE.curY[cid] != cy))
			return true;
		else
			return false;
	},
	record:function(cid,cx,cy,nx,ny){
		VEHICLE.curX[cid] = cx;
		VEHICLE.curY[cid] = cy;
		VEHICLE.nextX[cid] = nx;
		VEHICLE.nextY[cid] = ny;
	},
	newCar : function(style, id, loc) {
		var im = VEHICLE.getPaint(style);
		VEHICLE.styles[id] = style;
		var width = im.width * 0.1;
		var height = im.height * 0.1;
		var body = document.getElementById("frame");
		var car = document.createElement("canvas");
		var car_ctx = car.getContext("2d");
		car.setAttribute("id", "car_" + id);
		car.setAttribute("width", width);
		car.setAttribute("height", height);
		car.setAttribute("style", "position:absolute;z-index:10;top:"
				+ (loc.y - height / 2) + "px;left:" + (loc.x - width / 2)
				+ "px;width:" + width + "px;height:" + height + "px;");
		car_ctx.clearRect(0,0,width, height);
		car_ctx.translate(width / 2, height / 2);
		car_ctx.scale(0.05, 0.05);
		car_ctx.drawImage(im, -im.width / 2, -im.height / 2);
		body.appendChild(car);
	},

	getPaint : function(type) {
		var im = new Image();
		switch (type) {
		case 1:
			im.src = "css/images/car.jpg";
			break;
		case 2:
			im.src = "css/images/truck.jpg";
			break;
		case 3:
			im.src = "css/images/bus.jpg";
			break;
		}
		return im;
	},

	moveCar : function(from, to, cid) {
		
		var car = document.getElementById("car_" + cid);
		if (car == null) {
			VEHICLE.newCar(2, cid, from);
			VEHICLE.curX[cid] = from.x;
			VEHICLE.curY[cid] = from.y;
			VEHICLE.nextX[cid] = to.x;
			VEHICLE.nextY[cid] = to.y;
		} else {
			document.getElementById("frame").removeChild(car);
			VEHICLE.newCar(2, cid, from);
		}
		car = document.getElementById("car_" + cid);
		var im = VEHICLE.getPaint(VEHICLE.styles[cid]);
		var width = im.width * 0.1;
		var height = im.height * 0.1;

		var dis = Math.sqrt((to.x - from.x) * (to.x - from.x) + (to.y - from.y)
				* (to.y - from.y));
		var time = dis / VEHICLE.speed;
		var xx = (to.x - from.x) / time;
		var yy = (to.y - from.y) / time;
		var top = from.y - height / 2;
		var left = from.x - width / 2;
		var car_ctx = car.getContext("2d");
		car.setAttribute("width", width);
		car.setAttribute("height", height);
		car.setAttribute("style", "position:absolute;z-index:2;top:"
				+ (from.y - height / 2) + "px;left:" + (from.x - width / 2)
				+ "px;width:" + width + "px;height:" + height + "px;");
		car_ctx.clearRect(width, height);
		car_ctx.translate(width / 2, height / 2); // 中心坐标
		car_ctx.rotate(Math.atan2(to.y - from.y, to.x - from.x));
		car_ctx.scale(0.05, 0.05);
		car_ctx.drawImage(im, -im.width / 2, -im.height / 2);
		car_ctx.rotate(Math.atan2(from.y - to.y, from.x - to.x));

		// div.currentStyle.left
		function move() {
			if (width == 0 || height == 0) {
				width = 40;
				height = 15;
				car.setAttribute("width", width);
				car.setAttribute("height", height);
				car.setAttribute("style", "width:" + width + "px;height:"
						+ height + "px;");
				car_ctx.clearRect(width, height);
				car_ctx.translate(width / 2, height / 2); // 中心坐标
				car_ctx.rotate(Math.atan2(to.y - from.y, to.x - from.x));
				car_ctx.scale(0.05, 0.05);
				car_ctx.drawImage(im, -im.width / 2, -im.height / 2);
				car_ctx.rotate(Math.atan2(from.y - to.y, from.x - to.x));
			}
			if (time > 0) {
				top = top + yy;
				left = left + xx;
				time--;
				car.setAttribute("style", "position:absolute;z-index:2;top:"
						+ top + "px;left:" + left + "px;width:" + width
						+ "px;height:" + height + "px;");
			} else if (time < 0) {
				car.setAttribute("style", "position:absolute;z-index:2;top:"
						+ (to.y - height / 2) + "px;left:" + (to.x - width / 2)
						+ "px;width:" + width + "px;height:" + height + "px;");
			}
		}
		setInterval(move, 33);
	}
};